import React, { Component } from 'react'
import Breadcrumb from '../base/Breadcrumb'
import { Table, Button, Message } from 'element-react'
import Pagination from '../base/Pagination'
import {withRouter} from 'react-router-dom'
import styled from 'styled-components'

class memberIntegralList extends Component {
  constructor (props) {
    super(props)
    this.state = {
      totalElements: 30,
      totalPages: 0,
      pageNo: 0,
      columns: [
        {
          label: '项目名称',
          prop: 'name',
          align: 'center'
        },
        {
          label: '换算规则',
          prop: 'integral',
          align: 'center'
        },
        {
          label: '操作',
          prop: 'name',
          align: 'center',
          render: () => {
            return (
              <span>
                <Button type="info" size="small" onClick={this.edit.bind(this)}>编辑</Button>
              </span>
            )
          }
        }
      ],
      data: [
        {
          name: '1',
          integral: '1212'
        }
      ]
    }
  }
  componentDidMount () {}
  selectCustomerIntegral (data) {
    this.$ajax.getCustomerIntegral(data).then(res => {
      if (res.code === 200) {
      } else {
        Message.error(res.msg)
      }
    }).catch(() => {
      Message.error('网络错误')
    })
  }
  increase () {
    this.props.history.push({
      pathname: '/memberIntegralCreate',
      state: { fromDashboard: true }
    })
  }
  edit () {
    let id = 11
    this.props.history.push({
      pathname: `/memberIntegralEdit/${id}`,
      state: { fromDashboard: true }
    })
  }
  changePage () {}
  render () {
    const TableClass = styled.div`
      margin-top: 40px;
    `
    return (
      <div className="memberIntegralList">
        <Breadcrumb data={['会员', '积分规则']}/>
        <div className="inline-marginR-20"><button type="button" className="btn btn-increase" onClick={this.increase.bind(this)}>新增</button></div>
        <TableClass>
          <Table
              style={{width: '100%'}}
              columns={this.state.columns}
              data={this.state.data}
              border={true}
          />
        </TableClass>
        <Pagination total={this.state.totalElements} changePage={this.changePage.bind(this)}/>
      </div>
    )
  }
}
export default withRouter(memberIntegralList)